<!DOCTYPE  html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Denver Rogalla</title>
		
		<!-- CSS -->
		<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />
		<link rel="stylesheet" href="css/social-icons.css" type="text/css" media="screen" />
		<!-- ENDS CSS -->	
		
		<!--[if IE]>
		<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
		<![endif]-->
		<!-- ENDS JS -->
		
		<!-- JS -->
		<script type="text/javascript" src="js/jquery.min.js"></script>
		<script type="text/javascript" src="js/custom.js"></script>
		<script type="text/javascript" src="js/slider.js"></script>
		<script src="js/slides/source/slides.min.jquery.js"></script>
		<script src="js/quicksand.js"></script>
		
		<!-- superfish -->
		<link rel="stylesheet" media="screen" href="css/superfish.css" /> 
		<script type="text/javascript" src="js/superfish-1.4.8/js/hoverIntent.js"></script>
		<script type="text/javascript" src="js/superfish-1.4.8/js/superfish.js"></script>
		<script type="text/javascript" src="js/superfish-1.4.8/js/supersubs.js"></script>
		<!-- ENDS superfish -->

		<!-- poshytip -->
		<link rel="stylesheet" href="js/poshytip-1.0/src/tip-twitter/tip-twitter.css" type="text/css" />
		<link rel="stylesheet" href="js/poshytip-1.0/src/tip-yellowsimple/tip-yellowsimple.css" type="text/css" />
		<script type="text/javascript" src="js/poshytip-1.0/src/jquery.poshytip.min.js"></script>
		<!-- ENDS poshytip -->
		
		<!-- Tweet -->
		<link rel="stylesheet" href="css/jquery.tweet.css" media="all"  type="text/css"/> 
		<script src="js/tweet/jquery.tweet.js" type="text/javascript"></script> 
		<!-- ENDS Tweet -->
		
		<!-- Tweet -->
		<link rel="stylesheet" href="css/jquery.tweet.css" media="all"  type="text/css"/> 
		<script src="js/tweet/jquery.tweet.js" type="text/javascript"></script> 
		<!-- ENDS Tweet -->
		
		<!-- prettyPhoto -->
		<script type="text/javascript" src="js/prettyPhoto/js/jquery.prettyPhoto.js"></script>
		<link rel="stylesheet" href="js/prettyPhoto/css/prettyPhoto.css" type="text/css" media="screen" />
		<!-- ENDS prettyPhoto -->
		
		<!-- GOOGLE FONTS -->
		<link href='http://fonts.googleapis.com/css?family=Droid+Serif:400italic' rel='stylesheet' type='text/css'>

	</head>
	<body>
	
		<!-- Dynamic Background -->
		<div id="headerimgs">
			<div id="headerimg1" class="headerimg"></div>
			<div id="headerimg2" class="headerimg"></div>
		</div>
		<!-- ENDS Dynamic Background -->
		
		<!-- background nav -->
		<div id="headernav">
			<div id="back" class="btn"></div>
			<div id="next" class="btn"></div>
		</div>
		<!-- ENDS background nav -->
		
		<div id="top-gap"></div>

		<!-- wrapper -->
		<div class="wrapper">
		
			<a href="index.html"><img  id="logo" src="img/logo2.png" alt="Rogalla"></a>
			
			
			<!-- nav bar holder -->
			<div id="nav-bar-holder">
				<!-- Navigation -->
				<ul id="nav" class="sf-menu">
					<li><a href="index.html">Home</a></li>
					<li class="current-menu-item"><a href="gallery.html">Portfolio</a></li>
					<li><a href="page.html">Services</a>
						<ul>
							<li><a href="page.html">Web Design</a></li>
							<li><a href="#">Pricing</a></li>
						</ul>
					</li>
					<li><a href="portfolio.html">About</a></li>
					<li><a href="contact.html">Contact</a></li>
					
				</ul>
				<!-- ENDS Navigation -->
				
				<!-- Social -->
				<ul class="social">
					<li><a href="https://www.facebook.com/denver.rogalla" class="poshytip  facebook" title="Become a fan"></a></li>
					<li><a href="http://www.twitter.com" class="poshytip  twitter" title="Follow my tweets"></a></li>
					
				</ul>
				<!-- ENDS Social -->
			</div>
			<!-- ENDS nav bar holder -->
				
			<!-- content wrap -->	    	
	        <div id="content-wrap">
	        	
	        	<!-- Page wrap -->
	        	<div id="page-wrap">
	        	
					<div class="page-title"><h1>Portfolio</h1> <span>Browse my work below.  More work coming soon!</span></div>
					
					<!-- side content -->
					<div id="gallery-holder">
					
						<!-- filter -->
						<!--<ul id="portfolio-filter" class="gallery-filter">
				    		<li>Filter: </li>
				    		<li><a href="#" rel="all" > All </a></li>
				    		<li><a href="#" rel="graphics" > Graphics </a></li>
				    		<li><a href="#" rel="video">  Video </a></li>
				    		<li><a href="#" rel="logos" >Logos</a></li>
				    		
				    		<li class="layout-notext"></li>
				    		<li class="layout-text active"></li>
				    		<li class="layout-label">Layout: </li>
				    	</ul>
				    	<div class="clear"></div>-->
						<!-- filter -->
						
						<!-- Thumbnails -->
						<ul id="portfolio-list" class="gallery-thumbs" >
							<li class="graphics">
								<a href="img/lab2.PNG" title="Website" rel="prettyPhoto[group]"  class="plusbg"><img  src="img/lab2.PNG" title="Website" alt="Website." ></a>
								<div class="thumb-description">
									<span class="thumb-title">Scrolling Pages Design</span>
									<p>This website utilizes HTML 5 and CSS 3 to create a fluid page scrolling website design.  </p>
								</div>
							</li>
							
							<!--<li class="graphics">
								<a href="img/dummies/285x200.jpg" title="Lorem ipsum dolor" rel="prettyPhoto[group]" class="plusbg" ><img  src="img/dummies/285x200.jpg" title="Lorem ipsum dolor" alt="Pellentesque habitant morbi." ></a>
								<div class="thumb-description">
									<span class="thumb-title">Lorem ipsum dolor</span>
									<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante.</p>
								</div>
							</li>
							
							<li class="video">
								<a href="http://www.youtube.com/watch?v=pzI4D6dyp_o" title="Lorem ipsum dolor" rel="prettyPhoto[group]"  class="plusbg" ><img  src="img/dummies/video.jpg" title="Lorem ipsum dolor" alt="Pellentesque habitant morbi." ></a>
								<div class="thumb-description">
									<span class="thumb-title">Lorem ipsum dolor</span>
									<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante.</p>
								</div>
							</li>-->
							
							
							
						</ul>
						<div class="clear"></div>	
			            <!-- ENDS Thumbnails -->
						
					</div>
					<!-- ENDS side content -->
					
					
					<div class="clear"></div>
	        	
	        	</div>
	        	<!-- ENDS Page wrap -->
	        	
	        </div>
	        <!-- ENDS content wrap -->
	        
        </div>
		<!-- ENDS Wrapper -->
		
		<!-- FOOTER -->
		<div id="footer">
			<div class="footer-wrapper">
				
				
				<!-- footer-cols -->
				<ul id="footer-cols">
					<li>
						<h6>About the theme</h6>
						<p>For this theme, I wanted to aim for a sleek and professional look.  However, I also wanted to implement a fun and artistic side to the website as well.</p>
					</li>
					<li>
						<h6>Categories</h6>
						<ul>
							<li><a href="http://www.w3schools.com/">Quick Web Design Help</a></li>
							<li><a href="http://validator.w3.org/">HTML Validator</a></li>
							<li><a href="http://www.gimp.org/">GIMP Photo Editor</a></li>
						</ul>
					</li>
					<li>
						<h6>Comments</h6>
						<p>Go to the Contact tab to leave any comments!</p>
					</li>
				</ul>
				<!-- ENDS footer-cols -->
				
				<div id="footer-glare"></div>
				
			</div>
		</div>
		<!-- ENDS FOOTER -->
		
		<!-- footer-bottom -->
		<div id="footer-bottom">
			<div class="bottom-wrapper">
				<div id="bottom-left">
					&copy; 2012 Rogalla Design.  <a href="/">View portfolio</a>
				</div>
				<div id="bottom-right">
					<ul id="footer-nav">
						<li><a href="index.html">Home</a></li>
						<li><a href="gallery.html">Gallery</a></li>
						<li><a href="page.html">Pages</a>
						<li><a href="page.html">Contact</a>
					</ul>
				</div>
			</div>
		</div>
		<!-- ENDS footer-bottom -->


		
	</body>
</html>